<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  #include('../cdn/cdn.html')
  <title>管理员登录</title>
  <style type="text/css">
    .form {
      width: 300px;
      margin: 8vh auto;
      text-align: center;
      font-family: "隶书";
    }
  </style>
</head>
<body>
<div class="container">
  <div class="form">
    <div>
      <h1 class="text-info" style="font-size: 150px;">CK</h1>
    </div>
    <h4>欢迎登录</h4>
    <form @submit.prevent="login_">
      <div class="form-group">
        <input class="form-control" v-model="admin.name" placeholder="用户名" required="required">
      </div>
      <div class="form-group">
        <input type="password" class="form-control" v-model="admin.pass" placeholder="密码" required="required">
      </div>
      <div class="pull-right">
        <label for="bao">
          <input id="bao" type="checkbox" v-model="admin.remember" checked="checked">记住密码&nbsp;
        </label>
      </div>
      <button type="submit" class="btn btn-info btn-group-justified">登 录</button>
    </form>
  </div>
</div>
<script type="text/javascript">
  var login = new Vue({
    el: '.form',
    data: {
      admin: {
        name: '',
        pass: '',
        remember: true
      },
      url: '${prev ?! "/admin"}'
    },
    methods: {
      login_: function () {
        $.post('/admin/login', this.admin, function (data) {
          if (data.success) {
            location.href = login.url;
          } else {
            alert("登录失败！请输入正确的账号密码！");
          }
        });
      }
    }
  });
</script>
</body>
</html>